import { Card, Statistic } from 'antd';
import { useQuery } from '@tanstack/react-query';
import { getStatistics, getAllStudents } from '../../api/admin';

export default function AdminDashboard() {
  const { data: stats, isLoading: statsLoading } = useQuery({
    queryKey: ['admin', 'statistics'],
    queryFn: getStatistics,
    retry: false,
  });

  const { data: students = [], isLoading: studentsLoading } = useQuery({
    queryKey: ['admin', 'students'],
    queryFn: getAllStudents,
    retry: false,
  });

  return (
    <div className="grid md:grid-cols-3 gap-4">
      <Card>
        <Statistic 
          title="待审批课程" 
          value={statsLoading ? '...' : (stats?.pendingApplications || 0)} 
        />
      </Card>
      <Card>
        <Statistic 
          title="已发布课程" 
          value={statsLoading ? '...' : (stats?.totalCourses || 0)} 
        />
      </Card>
      <Card>
        <Statistic 
          title="学生总数" 
          value={studentsLoading ? '...' : students.length} 
        />
      </Card>
    </div>
  );
}


